<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>layout布置页面</title>
		<script type="text/javascript" src="../js/jquery-1.8.3.js" ></script>
		<script type="text/javascript" src="../js/easyui/jquery.easyui.min.js" ></script>
		<script type="text/javascript" src="../js/easyui/locale/easyui-lang-zh_CN.js" ></script>
		<link rel="stylesheet" href="../js/easyui/themes/default/easyui.css" />
		<link rel="stylesheet" href="../js/easyui/themes/icon.css" />
        <!--ztree的引入 -->
		<script type="text/jscript" charset="UTF-8" src="../../../../target/bos/js/ztree/jquery.ztree.all-3.5.js"></script>
		<link rel="stylesheet" type="text/css" href="../js/ztree/zTreeStyle.css" />
		
		
		
		
		<script type="text/javascript">
			$(function(){
				$("#grid").datagrid({
//					表格类的定义
					columns:[[
					{
					
					field:"id",
					title:"编号",
					width:100
					
					},
					{
						
					field:"name",
					title:"商品名称",
					width:100
						
					},
					{
						
					field:"price",
					title:"价格",
					width:100	
						
						
					}
					
					]],
//					远程数据加载
					url:"product.json",
//					分页条
					pagination:true,
//					顶部按钮
					toolbar:[
					{
						id:"saveBtn",
						text:"保存",
						iconCls:"icon-save",
						handle:function(){
							alert("保存...");
						}
						
						
					}
					]
					
					
				});
				
				
				
			});
			
			
			
		</script>
	</head>
	
	<body class="easyui-layout">
		<div data-options="region:'north',title:'传智播客管理系统'" style="height: 100px;">北</div>
		<div data-options="region:'south',title:'南部标题'" style="height: 100px;">南</div>
		<div data-options="region:'west',title:'菜单导航'" style="width: 200px;">
			<div class="easyui-accordion" data-options="fit:true">
				<div data-options="title:'基础菜单'">
					<!--
                    	作者：250226715@qq.com
                    	时间：2017-07-20
                    	描述：ZTree
                    -->
                    <ul id="myztree" class="ztree"></ul>
					
					
					
					
					<a href="javascript:void(0)" id="czbklink">传智播客</a>
				</div>
				<div data-options="title:'系统菜单'">菜单二</div>
				
			</div>
			
			
		</div>
		<div data-options="region:'east',title:'东部标题'" style="width: 200px;">东</div>
		<div data-options="region:'center',title:'中心标题'">
		
			<table id="grid"></table>	
				
			
			
			
		</div>
		
		
	</body>
</html>
